import React from 'react';
import { StatusTip } from 'tea-component';
import { useSelector } from 'react-redux';

export default function Loading() {
  // @ts-ignore
  const loading = useSelector((state) => state.globalReducer.loading);
  return (
    loading && (
      <div
        style={{
          display: 'flex',
          justifyContent: 'center',
          alignItems: 'center',
          position: 'fixed',
          top: '0px',
          bottom: '0px',
          left: '0px',
          right: '0px',
          zIndex: 9999,
          backgroundColor: '#000000',
          opacity: 0.2,
        }}
      >
        <StatusTip status="loading" loadingText="加载中..." style={{ color: '#fff', fontSize: '24px' }}></StatusTip>
      </div>
    )
  );
}
